008管理画面からヘッダー画像をアップロードできるようにする。「カスタムヘッダー」
公式テーマなどでは、すでにそう出来るよう設定済みだったりするかと思いますが、一からオリジナルのテーマを自作する場合は、自分で設定をしないといけないので、備忘録として書いておきます。
管理画面からヘッダー画像をアップロードできるようにする。「カスタムヘッダー」
functions.phpに下記を追加します。
<?php //管理画面からヘッダー画像をアップロードできるようにする。「カスタムヘッダー」 // デフォルトのロゴまでのURL define('HEADER_IMAGE', get_bloginfo('stylesheet_directory').'/images/bg_top.jpg'); // 画像の幅と高さ define('HEADER_IMAGE_WIDTH', 1000); define('HEADER_IMAGE_HEIGHT',120); // ヘッダーの文字色 define('HEADER_TEXTCOLOR', 'ffff33'); // カスタムヘッダーを有効にするための記述 add_custom_image_header('', 'my_admin_header_style'); // 管理画面用のスタイルの設定。多くの場合以下のままでいい。 function my_admin_header_style() { ?> <style type="text/css"> /* Shows the same border as on front end */ #headimg { border: none; max-width: 1000px; height: auto; width /***/:auto; } </style> <?php } ?>
上記を入れると、ダッシュボードのメニューの外観 →「ヘッダー」から画像をアップできるようになります。
アップローした「ヘッダー画像」を出力する
カスタムヘッダーを表示させるには、表示したいphpファイルに以下を記述します。
(たいていは header.php に入れる場合がほとんどかと思います)
(3行目です)
↓
<!--カスタムヘッダー画像の呼び出し--> <h2> <img src="<?php header_image(); ?>"><br /> <h1><a href="<?php echo get_settings('home'); ?>/"><?php bloginfo( 'name' ); ?></a></h1> <p><?php bloginfo('description'); ?></p> </h2>